/**
 * @version:		$Id: 02-layout.css 2 2011-07-26 00:59:53Z epatarroyo $
 * @copyright:		Copyright (C) 2010 OpenWeb Software. All rights reserved.
 * @license:		GNU/GPL
 * This version may have been modified pursuant to the GNU General Public License,
 * and as distributed it includes or is derivative of works licensed under the
 * GNU General Public License or other free or open source software licenses.
 */

/* CSS Styles by Ernesto Patarroyo - OpenWeb - http://openweb.co */

/****************
3 - Layout Styles
 ****************/

.accessibility{
position: absolute;
top: -5000px;
left: -5000px;
}
#usermenu{
background: #272822;
width: 100%;
position: fixed;
z-index: 100;
top: 0;
}
#wrapper{
width: 960px;
margin: 0 auto;
}
.wrapper{
width: 960px;
margin: 0 auto;
}

#header .wrapper{
position: relative;
height: 130px;
background:#ddd;
margin: 10px 0; 
}
#logo{
position: absolute;
top: 10px;
left: 10px;
}
#tagline{
position: absolute;
top: 90px;
left: 10px;
	}
#tagline p{
font-size: inherit;
font-family: inherit;
color: inherit;
margin: 0;
}
#lang{
position: absolute;
top: 10px;
right: 10px;
}
#search{
position: absolute;
right: 10px;
top: 20px;
}
#mainmenu{
background:#ddd;
margin: 10px 0; 
}
#call2action {
margin: 10px 0;
}
#main{
background:#ddd;
margin: 0;
padding: 0; 
}
#breadcrumbs{
margin: 10px 5px;
}
#featured .padding{
padding: 10px;
}
#col1{
float: left;
width: 25%; /* se pueden poner valores fijos */
}
#col1 .padding {
padding: 0 10px 0 0;
}
/*
#content debe estar siempre en width 100% para 
modificar valores dependiendo el ancho de las columnas
revisar tools/loadCSS.php lineas 26 a 36
*/
#content{
width: 100%; 
}
#content .padding{
margin: 0;
padding: 0 10px;
}
#col2{
float: right;
width: 25%;
}
#col2 .padding {
margin: 0;
padding: 0 0 0 10px;
}
.aside .module{
background: #fff;
border-radius: 4px;
border: 1px solid #ccc;
padding: 10px;
margin: 10px 0;
}
.top,
#message,
#component,
#extras,
#bottom {
clear: both;
}
#content .module{
background: #eee;
border-radius: 4px;
border: 1px solid #ccc;
padding: 10px;
margin: 10px 0;
}
#bottom .module{
background: #FFFFCC;
border-radius: 4px;
border: 1px solid #ccc;
padding: 10px;
margin: 10px;
}
#footer{
background:#ddd;
margin: 0;
padding: 0;
clear:both;
}
#footer .padding{
padding: 10px;
}
#footer .c1 .module{

}
#footer .c2 .module{
width: 50%;
float: left;
}
#footer .c3 .module{
width: 33.3%;
float: left;
}
#footer .c4 .module{
width: 25%;
float: left;
}
#footer .c5 .module{
width: 20%;
float: left;
}
#footer .c6 .module{
width: 16.6%;
float: left;
}
#footer .nav .module .padding{
background: #FFFFCC;
border-radius: 4px;
border: 1px solid #ccc;
padding: 5px;
margin: 5px;
}

#socialMedia{
clear: both;
background: #eee;
border-radius: 4px;
border: 1px solid #ccc;
padding: 10px;
margin: 10px 0;
}
#socialMedia p{
margin: 0;
}
#socialMedia img{
margin: 0 2px;
}
#about{
clear: both;
background: #eee;
border-radius: 4px;
border: 1px solid #ccc;
padding: 10px;
margin: 10px 0;
}
#copyright{
clear: both;
background: #eee;
border-radius: 4px;
border: 1px solid #ccc;
padding: 10px;
margin: 10px 0;
}